<template>
  <div class="page-main">
    <div class="banner"><span>我的报工单</span></div>
    <div class="container">
      <div class="header">
        <a-row type="flex" justify="space-between" align="middle">
          <a-col :xl="{ span: 14 }" :lg="{ span: 11 }">            
            <a-button class="hte-btn port-btn">导出</a-button>
          </a-col>
          <a-col :xl="{ span: 9 }" :lg="{ span: 13 }" class="input-ground">
            <a-input-group compact>
              <a-select default-value="合同状态">
                <a-select-option value="合同状态"> 合同状态 </a-select-option>
                <a-select-option value="合同名称"> 合同名称 </a-select-option>
              </a-select>
              <a-input-search v-model="valueSearch" @search="doSearch" placeholder="请按照关键字进行搜索" />
            </a-input-group>
            <a-button class="hte-btn del-btn" @click="visibleModel=true">高级搜索</a-button>
          </a-col>
        </a-row>
      </div>      
      <div class="content">
        <a-table
          :scroll="{ x: true }"
          class="hte-table-content"
          :columns="reservationColumns"
          :data-source="reservationData"
          :pagination="pagination"
          :loading="tabLoading"
          :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
          size="middle"
          @change="pageChange"
        >
        </a-table>
      </div>
    </div>
    <a-back-top class="backtodom" />
    <a-modal
      v-model="visibleModel"
      width="70vw"
      :bodyStyle="{ padding: '10px' }"
      title="高级搜索"
      @ok="callBackResult"
    >          
      <advanced-search :dataForm.sync="form"></advanced-search>
    </a-modal>
  </div>
</template>
<script>
import { getAction } from '@/api/manage'

export default {
  name: 'MyWorkOrderList',
  components: {
    HomeNav: () => import('@/components/layouts/HomeNav'),
    AdvancedSearch: () => import('@views/workReport/page/AdvancedSearch'),
  },
  data() {
    return {
      userinfo: {
        info: this.$store.getters.userInfo,
        module: 'MyWorkOrderList',
      },
      reservationColumns: [
        {
          title: '任务状态',
          dataIndex: 'taskTotal',
          width: 150,
          align: 'center',
          fixed: 'left',
          scopedSlots: { customRender: 'taskTotal' },
        },
        {
          title: '报工单编号',
          dataIndex: 'teamName',
          width: 180,
          fixed: 'left',
          align: 'center',
        },
        {
          title: 'PO单行号',
          dataIndex: 'completedTotal',
          width: 100,
          align: 'center',
        },
        {
          title: '合同编号',
          dataIndex: 'assss',
          width: 100,
          align: 'center',
        },
        {
          title: '合同名称',
          dataIndex: 'k',
          width: 200,
          align: 'center',
        },
        {
          title: '项目负责人',
          dataIndex: 'incompletedTotal',
          width: 200,
          align: 'center',
        },
        {
          title: '工期节点内容',
          dataIndex: 'delayTotal',
          width: 200,
          align: 'center',
        },
        {
          title: '付款节点内容',
          dataIndex: 'advanceCompletedTotal',
          width: 200,
          align: 'center',
        },
        {
          title: '付款节点',
          dataIndex: 'c',
          width: 200,
          align: 'center',
        },
        {
          title: '多个付款条件',
          dataIndex: 'b',
          width: 200,
          align: 'center',
        },
        {
          title: '合同金额',
          dataIndex: 'a',
          width: 200,
          align: 'center',
        },
        {
          title: '关联节点金额',
          dataIndex: 'd',
          width: 200,
          align: 'center',
        },
        {
          title: '节点标识',
          dataIndex: 'e',
          width: 200,
          align: 'center',
        },
        {
          title: '合同约定日期',
          dataIndex: 'r',
          width: 200,
          align: 'center',
        },
        {
          title: '预计完成日期',
          dataIndex: 't',
          width: 200,
          align: 'center',
        },
        {
          title: '实际完成日期',
          dataIndex: 'y',
          width: 200,
          align: 'center',
        },
        {
          title: '是否逾期',
          dataIndex: 'u',
          width: 200,
          align: 'center',
        },
        {
          title: '逾期责任方',
          dataIndex: 'i',
          width: 200,
          align: 'center',
        },
      ],
      reservationData: [],
      selectedRowKeys: [],
      pagination: {
        total: 0,
        current: 1,
      },
      tabLoading: false,
      currPageIndex: 1,
      currPageSize: 10,
      valueSearch: '',
      visibleModel: false,
      form: {},
    }
  },
  mounted() {
    this.getConTaskListData()
  },
  methods: {
    /**
     * 查询
     */
    getConTaskListData() {
      this.tabLoading = true
      getAction('/projectWorkTask/list', {
        pageSize: this.currPageSize,
        pageNo: this.currPageIndex,
        status: 5,
        taskBuildType: '2',
        keyword: this.searchVal,
        taskType: 40,
      }).then((res) => {
        if (res.code == 200 && res.result) {
          this.pagination.total = res.result.total
          res.result.records.forEach((item, index) => {
            item.key = index
          })
          this.reservationData = res.result.records
          this.tabLoading = false
        } else {
          this.$messageWorkReport.warning('数据加载失败:' + res.message)
          this.tabLoading = false
        }
      })
    },
    pageChange() {
      this.currPageIndex = page.current
      this.currPageSize = page.pageSize
      this.pagination.current = page.current
      this.getConTaskListData()
    },
    onSelectChange(selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys
    },
    doSearch() {
      this.currPageIndex = 0
      this.getConTaskListData()
    },
    /**
     * 高级搜索 
     */
    callBackResult(event){
      console.log(this.form)
    }
  },
}
</script>

<style lang="less" scoped>
@import '~@assets/less/hte-main.less';
.page-main {
  .banner {
    background-image: url(../~@assets/contract-top.png);
  }
}
</style>